<template>
  <base-modal
    :title="initData.pageType === 'edit' ? ' 验收计划分类编辑': ' 验收计划分类添加'"
    cancelText="取消"
    okText="保存"
    :width="900"
    v-on="$listeners"
    @ok="handleOk"
    :confirmLoading="loading.isSaving"
  >
    <a-form-model
      ref="form"
      :model="formInfo"
      :rules="rules"
      :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
      :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
    >
      <a-row :gutter="24">
        <a-col :md="12" :sm="12">
          <a-form-model-item label="分类名称" prop="name">
            <BaseInput placeholder="请输入" v-model.trim="formInfo.name" />
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item label="状态" prop="enabled">
            <a-select placeholder="请选择状态" v-model="formInfo.enabled">
              <a-select-option :value="1">可用</a-select-option>
              <a-select-option :value="0">不可用</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
  </base-modal>
</template>

<script>
import {
    addSelectListByType,
    updateSelectListByType,
    getSelectListByTypeDetail,
} from '@/api/safetySupervision/common.js'
import BaseModal from '@/components/BaseModal'
export default {
    name:'a'+Date.now(),    components: {
        BaseModal,
    },
    props: {
        initData: {
            type: Object,
            default() {
                return {}
            },
        },
    },
    data() {
        return {
            loading: {
                isSaving: false,
            },
            formInfo: {
                name: '',
                enabled: 1,
            },
            rules: {
                name: [{ required: true, message: '请输入名称', trigger: 'change' }],
                enabled: [{ required: true, message: '请选择状态', trigger: 'change' }],
            },
        }
    },
    created() {
        this.getDetail()
    },
    methods: {
        validateForm() {
            let flag = false
            this.$refs.form.validate((valid) => {
                flag = valid
              if(!valid) {
                this.$message.warning("请填写完所有必填项信息")
              }
            })
            return flag
        },
        async getDetail() {
            const { id } = this.initData
            if (!id) return
            const params = {
                id,
            }
            const [err, res] = await getSelectListByTypeDetail(params)
            if (!err) {
                this.formInfo = {
                    ...this.formInfo,
                    ...res.data,
                    enabled: Number(res.data.enabled),
                }
            }
        },
        async handleOk() {
            if (!this.validateForm()) return
            if (this.loading.isSaving) return
            this.loading.isSaving = true
            const { id, name, enabled } = this.formInfo
            const params = {
                id,
                name,
                enabled: !!enabled,
                type: 11,
            }
            const { pageType } = this.initData
            const fn = pageType === 'edit' ? updateSelectListByType : addSelectListByType
            const [err, res] = await fn(params)
            if (!err) {
                this.$message.success('成功')
                this.$emit('confirm')
            }
            this.loading.isSaving = false
        },
    },
}
</script>

<style lang="less" scoped>
form .ant-mentions,
form textarea.ant-input {
    height: auto !important;
    width: 100%;
}
</style>
